<template>
   <div class="person">
    <!-- <h2>姓名：{{name}}</h2>
    <h2>年龄：{{age}}</h2>
    <button @click="showTel">查看联系方式</button>
    <button @click="changename">修改名字</button>
    <button @click="addAge">改变年龄</button> -->
    <h1>一辆{{ car.brand }}</h1>
    <h1>价格{{ car.price }}</h1>
    <button @click="changePrice">改变价格</button>
   </div>
</template>

<script lang="ts"> 
//     export default {
//         name:"Person234",
    
//     }
</script>
<script lang="ts" setup>
import {ref} from "vue"
    let car = ref({
        brand:"奔驰",
        price:1000
    })
   
    function changePrice(){
        car.value.price +=10
    }
</script>

<style  scoped>


    .person{
        background-color: skyblue;
        padding: 20px;
        border-radius: 10px;
        box-shadow: 0 0 10px;
    }
</style>